<head>
  <script type="application/javascript" src="../lib/lax.min.js"></script>
  <script type="application/javascript">

    window.onload = function () {
      lax.init()

      lax.addDriver('scrollY', function () {
        return window.scrollY
      })
    }

  </script>
</head>

<style>
  .square {
    height: 200px;
    width: 200px;
    background-color: #a26ddc;
    margin-bottom: 0px;
    margin-left: -100px;
    margin-top: -100px;
    left: 50vw;
    top: 50vh;
    position: fixed;
  }

  body {
    padding: 0;
    background-color: #dedbde;
    background-image: linear-gradient(rgba(255, 255, 255, .2) 50%, transparent 50%, transparent);
    margin: 0;
    background-size: 700px 700px;
    height: 1000000px;
  }
</style>

<body>
  <div class="square lax lax_preset_spin:400:360 lax_preset_flipX"></div>
</body>